<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="./layui/css/layui.css">
    <link rel="stylesheet" href="./css/header.css">
    <title>简历模板</title>
    <script src="./layui/layui.js"></script>>
    <script src="./js/zixunjiqiren.js"></script>
</head>
<style>
    .last-title{
            text-align: center;
            font-size: 16px;
            color: #909090;
            padding-bottom:60px; 
        }
        .last-title h1{
            color: #363636;
            margin: 200px 0 20px 0;
        }
        .moban-test{
            /* display: inline-block; */
            /* position: relative; */
        }
        .moban-test div{
            position: relative;
            left: 50%;
            transform: translateX(-50%);
            text-align: center;
            margin: 0 0 50px 0;
            padding: 50px 30px 0 30px;
            width: 180px;
            height: 200px;
            border-radius: 10px;
            box-shadow: 0px 0px 8px #ddd;
        }
        .moban-test h3{
            margin: 20px 0 20px 0;
        }
        .moban-test p{
            color: #9c9c9c;
        }
        .moban-test2{
            text-align: center;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
            margin: 0 0 50px 0;
            padding: 50px 30px 0 30px;
            width: 180px;
            height: 200px;
            border-radius: 10px;
            background: #fff;
            box-shadow: 0px 0px 8px #ddd;
            display: none;
        }
        .moban-test:hover .moban-test2{
            display: inline;
        }
        .moban-test2 button{
            width: 80%;
            color: #ff4f4c;
            border-color: #ff4f4c;
        }
        .moban-test2 button:hover{
            background: #ff4f4c;
            border: 0;
            color:#fff;
        }



.tupian img{
    height: 60px;
    
}
.tupian h3{padding-top: 17px;

}
.tupian p{
    font-size: 14px;
    padding-left:13px;
    padding-right: 13px;
    color:rgb(77, 75, 75)
}
.anniu{
    margin-top: 80px;
    background-color: rgb(255, 79, 76);
    width: 200px;
    height: 50px;
    border: none;
}
.qzk h1{
    font-size: 30px;
}
.qzk p{
    color: rgba(187, 187, 179, 0.747);
    padding-top: 20px;
}
.zhongjian{
    border: 1px solid red;
    width: 100%;
    height: 400px;
}
.dibu{
    height:880px;
    width: 100%;
}
.jianli{
    margin-top: 50px;
   
    /* height: 500px; */
    margin-left: 30px;
    margin-right: 30px;
    
    
}

.jianli img{
    width: 100%;
    height: 100%;
    border: 1px solid rgb(151, 149, 149);
}
.jianli p{
   
    color:rgba(187, 187, 179, 0.747);
  
}
.jianli img{
   
}
.qzk{
    margin-top:100px;
}
.qzk h1{
    color: rgb(77, 75, 75);
}
.wendang1 img{
    background: #fff;
}

#k{
    display:none;
    width: 200px; height: 220px;

}
#k img{
    height: 200px;width: 200px;
}

#k p{
    color: rgb(144, 148, 151);
    text-align: center
}
#z{
    display: none;
}
#z img{
    height: 100%; width:100%;
}
@media screen and(max-width):750px){
    .shipei{

    }
}

</style>

<body>
<!--ji qi ren zi xun-->
<div class="jiqiren">
    <div class="zixun site-demo-button" id="Zixun">
        <button data-method="notice" class="layui-icon layui-icon-reply-fill layui-btn"></button>
    </div>
    <div id="Zixunk"
         style="display: none;/*position: fixed;bottom: 50px;right:15%;transform: translateX(15%);*/z-index:10;width: 364px;height: 550px;background-color: #adadad">
        <div style="height: 60px;font-size: 14px;background-color: #ff4f4c;color: #fff">
            <i style="font-size: 40px;float: left;margin: 10px 0 0 10px"
               class="zixun-header layui-icon layui-icon-survey"></i>
            <h3 style="float: left; margin: 20px 0 0 20px">超级简历机器人</h3>
            <button style="float: right;background-color:#ff4f4c;border:0;color: #fff;margin: 20px 10px 0 0">一</button>
        </div>
        <div style="height:376px;padding: 20px 20px 0 20px;background-color: #f5f8fa" class="zixun-nav">
            <p style="color: #9b9b9b;">超级简历机器人 10:05:45 </p>
            <p style="width: 60%;padding:5px 5px 5px 5px;border-radius: 10px;background-color: #fff;">您好，很高兴为您服务！</p>
        </div>
        <div style="padding:10px 10px 10px 10px;background-color: #fff;" class="zixun-fasong">
            <div class="rengong">
                <i style="font-size: 25px;color: #ff4f4c;" class="layui-icon layui-icon-praise"></i>
                <button style="border: 0;color: #999999;background-color: #fff;float: right">转人工</button>
            </div>
            <div style="margin: 10px 0 0 0 ;padding-bottom:20px" class="input">
                <input style="width: 80%;background-color: #fff;border: 0" type="text" class=""
                       placeholder="很高兴为您服务，请描述您的问题">
                <button style="float: right;padding:0 5px 0 5px;margin: 15px 0 5px 0;">发送</button>
            </div>
        </div>
        <div style="width: 100%;text-align: center;background-color: #eee;margin-top: 0px">
            <p style="">Udesk提供客服软件支持</p>
        </div>
    </div>
</div>
<!-- header -->
<header class="max-header layui-container">
    <div class="main-header layui-row">
        <div class="header-logo layui-col-lg3 layui-col-md2 layui-col-sm2 layui-col-xs4">
            <a href="./chaojijianli.html"><img src="./images/chjjl-logo..png" alt=""></a>
        </div>
        <ul class="header-tittle layui-col-lg5 layui-col-md6">
            <li style="margin-left:40px;padding-left: 0px" class="zhd-title">
                <a href="./jianligonglue.html">简历模板</a>
            </li>
            <li>
                <a href="./qiuzhixin.html">求职信</a>
            </li>
            <li>
                <a href="./jianligonglue.html">简历攻略</a>
            </li>
            <li>
                <a href="./zhenduan.html">简历诊断</a>
            </li>
            <li>
                <a href="./mingqineitui.html">名企内推</a>
            </li>
        </ul>
        <div class="header-home layui-col-sm5 layui-col-xs3">
            <div class="home-icon layui-icon layui-icon-spread-left">
                <ul class="home-ul">
                    <li>
                        <a href="./jianlimoban.html">简历模板</a>
                    </li>
                    <li>
                        <a href="./qiuzhixin.html">求职信</a>
                    </li>
                    <li>
                        <a href="./jianligonglue.html">简历攻略</a>
                    </li>
                    <li>
                        <a href="./zhenduan.html">简历诊断</a>
                    </li>
                    <li>
                        <a href="./mingqineitui.html">名企内推</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="header-app layui-col-lg4 layui-col-md4 layui-col-sm5 layui-col-xs5">
            <div class="app-tubiao">
                <div class="app-earth layui-icon layui-icon-website">
                    <div class="language">
                        <ul>
                            <li><a href="">中文</a></li>
                            <li><a href="">EN</a></li>
                        </ul>
                    </div>
                </div>
                <div class="app-iphone layui-icon layui-icon-cellphone">
                    <div class="app-download">
                        <h3>扫码下载App 同步编辑</h3>
                        <img src="./images/appDownloadIcon.png" alt="">
                        <button style="margin: 10px 0 0 5%;" class="layui-btn layui-btn-primary">App下载</button>
                        <button style="margin: 10px 0 0 5%;" class="layui-btn layui-btn-primary">微信版</button>
                    </div>
                </div>
                <div class="ge">
                    <a href="">|</a>
                </div>
            </div>
            <div class="app-button">
                <button class="app-dl layui-btn layui-btn-danger"><a href="./登录注册/qitafanshidenglu.html">登录</a></button>
                <button class="layui-btn layui-btn-danger"><a href="./登录注册/qitafanshidenglu.html">注册</a></button>
                <button class="layui-btn layui-btn-md layui-btn-danger">导入模板</button>
            </div>
        </div>
    </div>
</header>
<!-- content -->
<div class="quanbu" style="background-color: rgb(245, 245, 247)">
    <div class="content-last layui-container">
            <div class="last-title layui-row">
                <h1 class="layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12">
                    选择你的简历模板
                </h1>
                <p class="layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-lxs12">
                    选对专业的简历模板，帮你提高 2 倍求职成功率
                </p>
            </div>
            <div class="last-moban layui-row">
                <div id="moban-test-a" class="moban-test layui-col-lg3 layui-col-md4 layui-col-sm6 layui-col-xs12 ">
                    <div>
                        <img src="./images/11.png" alt="">
                        <h3>零经验实习模板</h3>
                        <p>此模板适用于学生找实习，第一次工作，没有实习经历的同学</p>
                        <ul class="moban-test2 layui-row site-demo-button" id="layerDemo" style="margin-bottom: 0;">
                            <button  data-method="notice"  style="margin: 20px 0 20px 5%;" class="layui-btn layui-btn-primary">中文模板</button>
                            <button  data-method="notice"  style="margin: 20px 0 20px 5%;" class="layui-btn layui-btn-primary">英文模板</button>
                        </ul>
                    </div>
                </div>
                <div id="moban-test-a" class="moban-test layui-col-lg3 layui-col-md4 layui-col-sm6 layui-col-xs12 ">
                    <div>
                        <img src="./images/2.png" alt="">
                        <h3>学生求职模板</h3>
                        <p>此模板适用于学生找实习或全职工作，有一定实习经历的同学</p>
                        <ul class="moban-test2 layui-row site-demo-button" id="layerDemo" style="margin-bottom: 0;">
                            <button  data-method="notice"  style="margin: 20px 0 20px 5%;" class="layui-btn layui-btn-primary">中文模板</button>
                            <button  data-method="notice"  style="margin: 20px 0 20px 5%;" class="layui-btn layui-btn-primary">英文模板</button>
                        </ul>
                    </div>
                </div>
                <div id="moban-test-a" class="moban-test layui-col-lg3 layui-col-md4 layui-col-sm6 layui-col-xs12 ">
                    <div>
                        <img style="height:60px" src="./images/33.png" alt="">
                        <h3>申请研究生模板</h3>
                        <p>此模板适用于学生申请国内及海外的研究生，或考研复试时使用</p>
                        <ul class="moban-test2 layui-row site-demo-button" id="layerDemo" style="margin-bottom: 0;">
                            <button  data-method="notice"  style="margin: 20px 0 20px 5%;" class="layui-btn layui-btn-primary">中文模板</button>
                            <button  data-method="notice"  style="margin: 20px 0 20px 5%;" class="layui-btn layui-btn-primary">英文模板</button>
                        </ul>
                    </div>
                </div>
                <div id="moban-test-a" class="moban-test layui-col-lg3 layui-col-md4 layui-col-sm6 layui-col-xs12 ">
                    <div>
                        <img src="./images/4.png" alt="">
                        <h3>本科留学模板</h3>
                        <p>此模板仅适用于高中生，申请国外本科留学，有针对性的英文案例和引导</p>
                        <ul class="moban-test2 layui-row site-demo-button" id="layerDemo" style="margin-bottom: 0;">
                            
                            <button  data-method="notice"  style="margin: 40px 0 40px 5%;" class="layui-btn layui-btn-primary">英文模板</button>
                        </ul>
                    </div>
                </div>
                <div id="moban-test-a" class="moban-test layui-col-lg3 layui-col-md4 layui-col-sm6 layui-col-xs12 ">
                    <div>
                        <img src="./images/5.png" alt="">
                        <h3>经典工作模式</h3>
                        <p>此模板适用于工作经验一年以上，想要变动工作的人士，适用于全行业</p>
                        <ul class="moban-test2 layui-row site-demo-button" id="layerDemo" style="margin-bottom: 0;">
                            <button  data-method="notice"  style="margin: 20px 0 20px 5%;" class="layui-btn layui-btn-primary">中文模板</button>
                            <button  data-method="notice"  style="margin: 20px 0 20px 5%;" class="layui-btn layui-btn-primary">英文模板</button>
                        </ul>
                    </div>
                </div>
                <div id="moban-test-a" class="moban-test layui-col-lg3 layui-col-md4 layui-col-sm6 layui-col-xs12 ">
                    <div>
                        <img src="./images/6.png" alt="">
                        <h3>投行咨询模板</h3>
                        <p>此模板适用于寻求投行，咨询，四大或外企工作岗位的人士</p>
                        <ul class="moban-test2 layui-row site-demo-button" id="layerDemo" style="margin-bottom: 0;">
                            <button  data-method="notice"  style="margin: 20px 0 20px 5%;" class="layui-btn layui-btn-primary">中文模板</button>
                            <button  data-method="notice"  style="margin: 20px 0 20px 5%;" class="layui-btn layui-btn-primary">英文模板</button>
                        </ul>
                    </div>
                </div>
                <div id="moban-test-a" class="moban-test layui-col-lg3 layui-col-md4 layui-col-sm6 layui-col-xs12">
                    <div>
                        <img src="./images/7.png" alt="">
                        <h3>产品经理模板</h3>
                        <p>此模板适用于申请互联网行业的产品相关岗位，有针对性的模块和引导</p>
                        <ul class="moban-test2 layui-row site-demo-button" id="layerDemo" style="margin-bottom: 0;">
                            <button  data-method="notice"  style="margin: 40px 0 40px 5%;" class="layui-btn layui-btn-primary">中文模板</button>
                        
                        </ul>
                    </div>
                </div>
                <div id="moban-test-a" class="moban-test layui-col-lg3 layui-col-md4 layui-col-sm6 layui-col-xs12 ">
                    <div>
                        <img src="./images/8.png" alt="">
                        <h3>程序员模板</h3>
                        <p>此模板适用于互联网行业的程序员和技术求职者找全职工作、跳槽时使用</p>
                        <ul class="moban-test2 layui-row site-demo-button" id="layerDemo" style="margin-bottom: 0;;">
                            <button  data-method="notice"  style="margin: 40px 0 40px 5%;" class="layui-btn layui-btn-primary">中文模板</button>
                          
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    <div class="dibu" style="text-align: center;">
        <div class="site-demo-button" id="layerDemo" style="margin-bottom: 0;">
            <div class="" id="layerDemo" style="margin-bottom: 0;">
                    <div data-method="offset" data-type="auto" class=" layui-btn layui-btn-danger layui-btn-lg">定制你的模板</div>
                </div>
            </div>
            
                                
                                <div class="qzk">
                                    <h1>使用超级简历拿到名企Offer</h1>
                                    <p>已经通过超级简历，成功投入职投行/咨询/BAT/五百强名企的大牛简历分享</p>
                                </div>

                                <div class="layui-container">
                                <div class="jianli layui-row layui-col-space30">
                                        <div id="layerDemo" class="wendang1 site-demo-button   layui-col-lg3 layui-col-md3 layui-col-sm6 layui-col-xs12">
                                               
                                                <img data-method="notice" class="layui-btn" src="./images/jianli1.jpg" alt="">
                                                <p>2018纽约大学硕士|中信投行部</p>
                                    </div>
                                        
                                        <div id="layerDemo" class="wendang1 site-demo-button  layui-col-lg3 layui-col-md3 layui-col-sm6 layui-col-xs12">
                                               
                                                    <img data-method="notice" class="layui-btn" src="./images/jianli2.png" alt="">
                                                    <p>2019清华应届生|腾讯产品经理全职</p>
                                        </div>
                                  
                                    <div id="layerDemo" class="wendang1 site-demo-button  layui-col-lg3 layui-col-md3 layui-col-sm6 layui-col-xs12">
                                               
                                            <img data-method="notice" class="layui-btn" src="./images/jianli3.png" alt="">
                                            <p> 2020北大硕士|麦肯锡咨询实习生</p>
                                        </div> 
                                <div id="layerDemo" class="wendang1 site-demo-button   layui-col-lg3 layui-col-md3 layui-col-sm6 layui-col-xs312">
                                               
                                        <img data-method="notice" class="layui-btn" src="./images/jianli4.png" alt="">
                                        <p> 6年工作经验|滴滴人力资源总监</p>
                            </div>
                                </div>
                                
                            
                                
                                       
                                       
                                    </div>
                                    <div class=" layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12 site-demo-button" id="layerDemo" style="margin-top:40px">
                                        <button data-method="offset" data-type="auto" class="layui-btn layui-btn-lg" style="margin: 0 auto;background-color:rgb(255, 79, 76);">立即使用</button>
    
                                    </div>
                                </div>
                                


                               
  

    </div>
    <div id="k">
        <img src="./images/下载.png">
        <p>扫码关注注册专业邮箱</p>
    </div>
    <div id="z">
        
        <img src="./images/jianli1.jpg">
  
        </div>
       
        

    
  
    

<script>
        layui.use('layer', function(){ //独立版的layer无需执行这一句
          var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句
          
          //触发事件
          var active = {
            setTop: function(){
              var that = this; 
              //多窗口模式，层叠置顶
              layer.open({
                type: 2 //此处以iframe举例
                ,title: '当你选择该窗体时，即会在最顶端'
                ,area: ['390px', '260px']
                ,shade: 0
                ,maxmin: true
                ,offset: [ //为了演示，随机坐标
                  Math.random()*($(window).height()-300)
                  ,Math.random()*($(window).width()-390)
                ] 
                ,content: '//layer.layui.com/test/settop.html'
                ,btn: ['继续弹出', '全部关闭'] //只是为了演示
                ,yes: function(){
                  $(that).click(); 
                }
                ,btn2: function(){
                  layer.closeAll();
                }
                
                ,zIndex: layer.zIndex //重点1
                ,success: function(layero){
                  layer.setTop(layero); //重点2
                }
              });
            }
            ,confirmTrans: function(){
              //配置一个透明的询问框
              layer.msg('大部分参数都是可以公用的<br>合理搭配，展示不一样的风格', {
                time: 20000, //20s后自动关闭
                btn: ['明白了', '知道了', '哦']
              });
            }
            ,notice: function(){
              //示范一个公告层
              layer.open({
                type: 1
                ,title: false //不显示标题栏
                ,closeBtn: false
                ,area: '600px;'
                ,shade: 0.8
                ,id: 'LAY_layuipro' //设定一个id，防止重复弹出
                ,btn: ['使用', '关闭']
                ,btnAlign: 'c'
                ,moveType: 1 //拖拽模式，0或者1
                ,content: $('#z')
                ,success: function(layero){
                  var btn = layero.find('.layui-layer-btn');
                  btn.find('.layui-layer-btn0').attr({
                    href: 'http://www.layui.com/'
                    ,target: '_blank'
                  });
                }
              });
            }
            ,offset: function(othis){
              var type = othis.data('type')
              ,text = othis.text();
              layer.open({
        type: 1
        ,offset: type //具体配置参考：http://www.layui.com/doc/modules/layer.html#offset
        ,id: 'layerDemo'+type //防止重复弹出
        ,content: $('#k')
        // ,btn: '其他注册方式'
        ,btnAlign: 'c' //按钮居中
        ,shade: 0 //不显示遮罩
        ,yes: function(){
          layer.closeAll();
        }
      });
    }
  };
          $('#layerDemo .layui-btn').on('click', function(){
            var othis = $(this), method = othis.data('method');
            active[method] ? active[method].call(this, othis) : '';
          });
          
        });
        </script>
        

</body>
</html>